<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>button</title>
    <link rel="stylesheet" href="style.css"/>
    <script type="text/javascript">
        window.onload = function(){
            var mbutton = document.getElementById("button");
            mbutton.onclick=function(){
                if(mbutton.value=="按钮被重新赋值"){
                    mbutton.value = "这里是一个按钮";
                    mbutton.style.color='black';
                }else{
                    mbutton.value = '按钮被重新赋值';
                    mbutton.style.color='red';
                }

            }
        };
    </script>
    <style type="text/css">
        a{
            color: yellow;
        }
        a:hover{
            color: purple;
        }
        input{
            width: 200px;
            height: 50px;
        }
    </style>
</head>
<body>
<div style="display:block;width:300px;height:300px;background-color:gray">
    <center>
        <h1 style="color:blue;" id="h1">邮件交互功能测试</h1><br/>
        <!-- <button id = "button">buttttttton</button> -->
        <input type="button" name="text" value="这里是一个按钮" id = "button"/>
        <br/>
        <a href="https://www.baidu.com">去百度</a>
    </center>
</div>
</body>
</html>